<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>uupaa-excanvas.js - README</title>
<style type="text/css">@import url(./README.css);</style>
<style type="text/css">
.star5 { display: -moz-inline-box; display: inline-block; width: 55px; height: 10px; background: url(star.gif) repeat-x; }
.star4 { display: -moz-inline-box; display: inline-block; width: 44px; height: 10px; background: url(star.gif) repeat-x; }
.star3 { display: -moz-inline-box; display: inline-block; width: 33px; height: 10px; background: url(star.gif) repeat-x; }
.star2 { display: -moz-inline-box; display: inline-block; width: 22px; height: 10px; background: url(star.gif) repeat-x; }
.star1 { display: -moz-inline-box; display: inline-block; width: 11px; height: 10px; background: url(star.gif) repeat-x; }
a.star5 { border-bottom: 2px dotted gold; }
a.star4 { border-bottom: 2px dotted gold; }
a.star3 { border-bottom: 2px dotted gold; }
a.star2 { border-bottom: 2px dotted gold; }
a.star1 { border-bottom: 2px dotted gold; }
</style>
</head>
<body>
<p>
   | <a href="http://code.google.com/p/uupaa-js-spinoff/">Project Home(Google Code)</a>
   | <a href="./README.htm">README</a>
   | <a href="./DEMO.htm">DEMO</a>
   | <a href="./CLASS.htm">Reference</a> |<br />
   | <a href="./CHANGELOG.htm">ChangeLog</a>
   | <a href="./LICENSE.htm">License</a>
   | <a href="http://uupaa-js.googlecode.com/svn/trunk/GLOSSARY.htm">Glossary</a>
   |
</p>
<hr />
<h1>uupaa-excanvas.js</h1>
<p>uupaa-excanvas.js is JavaScript library where <a href="http://www.whatwg.org/specs/web-apps/current-work/#the-canvas-element">HTML5::Canvas</a> is offered. 
  <br /><span lang="ja">uupaa-excanvas.js は <a href="http://www.whatwg.org/specs/web-apps/current-work/#the-canvas-element">HTML5::Canvas</a> 互換機能を提供する JavaScript ライブラリです。</span></p>
  <img src="demo/images/apiblock.png" alt="API block" />
<hr />
<h2>Features - 特徴</h2>
<ul>
<li>Hybrid:
    <br />- Rendering is done with Silverlight and VML in IE, and other browsers do rendering with canvas.
    <br /><span lang="ja"> - IE なら Silverlight と VML でレンダリングを行い、その他のブラウザは canvas でレンダリングします。</span></li>
<li>Right:
    <br />- The rendering of the sample of <a href="https://developer.mozilla.org/en/Canvas_tutorial">MDC Canvas tutorial</a> can be almost done.
    <br /><span lang="ja"> - <a href="https://developer.mozilla.org/ja/Canvas_tutorial">MDC Canvas tutorial</a> のほとんどのサンプルをレンダリングできます。</span></li>
<li>Extend Native Canvas API:
    <br /><span lang="ja"> - IE以外のブラウザの機能も拡張します。<br />Opera9.5～10, Firefox3.0で、<a href="demo/8_1_canvas_fillText_strokeText.html">fillText()</a>,
                             <a href="demo/8_2_canvas_measureText.html">measureText()</a>, <a href="demo/9_1_canvas_shadow_text.html">Text Shadow</a> が利用可能になります。
                             </span></li>

</ul>

<hr />
<h2>Browser support - サポートするブラウザ</h2>
<ul>
 <li><img src="http://uupaa-js.googlecode.com/svn/trunk/img/c32.png" alt="" />Google Chrome</li>
 <li><img src="http://uupaa-js.googlecode.com/svn/trunk/img/s32.png" alt="" />Safari 3+</li>
 <li><img src="http://uupaa-js.googlecode.com/svn/trunk/img/i32.png" alt="" />IE 6+</li>
 <li><img src="http://uupaa-js.googlecode.com/svn/trunk/img/o32.png" alt="" />Opera 9.5+<i></i></li>
 <li><img src="http://uupaa-js.googlecode.com/svn/trunk/img/f32.png" alt="" />Firefox 3+<i></i></li>
</ul>

<hr />
<h2>Rendering backend - レンダリングバックエンド</h2>
<p>Silverlight or VML is used in IE. 
<br /><span lang="ja">IE では、Silverlight(SL) または VML を利用します。
      <br />HTML5::Canvas API が使えるブラウザでは、ブラウザが用意している機能を利用します。</span></p>

<table>
<tr><th></th><th>Native<br />HTML5::Canvas<br />API</th><th>Silverlight</th><th>VML</th><th>SVG</th></tr>
<tr><td><img src="http://uupaa-js.googlecode.com/svn/trunk/img/c32.png" alt="" />Google Chrome</td>
  <td><img src="http://uupaa-js.googlecode.com/svn/trunk/img/check.png" alt="v" /></td>
  <td>-</td>
  <td>-</td>
  <td>-</td></tr>
<tr><td><img src="http://uupaa-js.googlecode.com/svn/trunk/img/s32.png" alt="" />Safari 3+</td>
  <td><img src="http://uupaa-js.googlecode.com/svn/trunk/img/check.png" alt="v" /></td>
  <td>-</td>
  <td>-</td>
  <td>-</td></tr>
<tr><td><img src="http://uupaa-js.googlecode.com/svn/trunk/img/i32.png" alt="" />IE 6</td>
  <td>-</td>
  <td><img src="http://uupaa-js.googlecode.com/svn/trunk/img/check.png" alt="v" /></td>
  <td><img src="http://uupaa-js.googlecode.com/svn/trunk/img/check.png" alt="v" /></td>
  <td>-</td></tr>
<tr><td><img src="http://uupaa-js.googlecode.com/svn/trunk/img/i32.png" alt="" />IE 7</td>
  <td>-</td>
  <td><img src="http://uupaa-js.googlecode.com/svn/trunk/img/check.png" alt="v" /></td>
  <td><img src="http://uupaa-js.googlecode.com/svn/trunk/img/check.png" alt="v" /></td>
  <td>-</td></tr>
<tr><td><img src="http://uupaa-js.googlecode.com/svn/trunk/img/i32.png" alt="" />IE 8(IE7mode or IE5mode)</td>
  <td>-</td>
  <td><img src="http://uupaa-js.googlecode.com/svn/trunk/img/check.png" alt="v" /></td>
  <td><img src="http://uupaa-js.googlecode.com/svn/trunk/img/check.png" alt="v" /></td>
  <td>-</td></tr>
<tr><td><img src="http://uupaa-js.googlecode.com/svn/trunk/img/i32.png" alt="" />IE 8(IE8mode)</td>
  <td>-</td>
  <td><img src="http://uupaa-js.googlecode.com/svn/trunk/img/check.png" alt="v" /></td>
  <td><img src="http://uupaa-js.googlecode.com/svn/trunk/img/check.png" alt="v" /></td>
  <td>-</td></tr>
<tr><td><img src="http://uupaa-js.googlecode.com/svn/trunk/img/o32.png" alt="" />Opera 9.5+</td>
  <td><img src="http://uupaa-js.googlecode.com/svn/trunk/img/check.png" alt="v" /></td>
  <td>-</td>
  <td>-</td>
  <td><img src="http://uupaa-js.googlecode.com/svn/trunk/img/check.png" alt="v" /></td></tr>
<tr><td><img src="http://uupaa-js.googlecode.com/svn/trunk/img/f32.png" alt="" />Firefox 3+</td>
  <td><img src="http://uupaa-js.googlecode.com/svn/trunk/img/check.png" alt="v" /></td>
  <td>-</td>
  <td>-</td>
  <td>-</td></tr>
</table>

<hr />
<h2>Support information - サポート情報</h2>
<p><span lang="ja">以下は、uupaa-excanvas.js で機能を強化した状態のものです。
    <br />uupaa-excanvas.js を利用していない場合は、IE以外のブラウザで以下の機能制限があります。</span></p>
<blockquote style="background: #122; padding: 10px">
<p>Opera9.5+ や Firefox3.0 で Text API を利用できません。font, textAlign, textBaseline も保持されません。
</p>
<p>Opera9.5+ や Firefox3.0 で Shadow API を利用できません。shadowColor, shadowOffsetX, shadowOffsetY, shadowBlur は保持されません。
</p>
</blockquote>
<p>Support level<br /><span lang="ja">サポート状況を★の数で表現しています。</p></span>
<blockquote style="background: #122; padding: 10px">
<p><span class="star5"></span> 5: supported. - <span lang="ja">サポートしています。</span></p>
<p><span class="star4"></span> 4: supported. result is somewhat different. - <span lang="ja">サポートしています。結果が多少異なります。</span></p>
<p><span class="star2"></span> 2: There are a few problems. - <span lang="ja">多少の問題があります。</span></p>
<p><span class="star1"></span> 1: There is a fatal problem. - <span lang="ja">致命的な問題があります。</span></p>
<p><span class="star0"></span> -: unsupported. - <span lang="ja">サポートしていません。</span></p>
</blockquote>



<table>
<caption>HTMLCanvasElement</caption>
<thead>
<tr>
  <th>function / property</th><th>condition</th>
  <th><img src="http://uupaa-js.googlecode.com/svn/trunk/img/c32.png" alt="" /></th>
  <th><img src="http://uupaa-js.googlecode.com/svn/trunk/img/s32.png" alt="" /><br />3+</th>
  <th><img src="http://uupaa-js.googlecode.com/svn/trunk/img/i32.png" alt="" /><br />Silverlight</th>
  <th><img src="http://uupaa-js.googlecode.com/svn/trunk/img/i32.png" alt="" /><br />VML</th>
  <th><img src="http://uupaa-js.googlecode.com/svn/trunk/img/o32.png" alt="" /><br />9.5+</th>
  <th><img src="http://uupaa-js.googlecode.com/svn/trunk/img/f32.png" alt="" /><br />3.0</th>
  <th><img src="http://uupaa-js.googlecode.com/svn/trunk/img/f32.png" alt="" /><br />3.5</th></tr>
</thead>
<tbody>
<tr>
  <th>width</th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th>height</th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th>toDataURL()</th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td>-</td>
  <td>-</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th>toDataURL()</th><td>"image/png"</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td>-</td>
  <td>-</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th>toDataURL()</th><td>"image/jpeg"</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td>-</td>
  <td>-</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th>getContext()</th><td>"2d"</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
</tbody>
</table>

<table>
<caption>CanvasRenderingContext2D</caption>
<thead>
<tr>
  <th>function / property</th><th>condition</th>
  <th><img src="http://uupaa-js.googlecode.com/svn/trunk/img/c32.png" alt="" /></th>
  <th><img src="http://uupaa-js.googlecode.com/svn/trunk/img/s32.png" alt="" /><br />3+</th>
  <th><img src="http://uupaa-js.googlecode.com/svn/trunk/img/i32.png" alt="" /><br />Silverlight</th>
  <th><img src="http://uupaa-js.googlecode.com/svn/trunk/img/i32.png" alt="" /><br />VML</th>
  <th><img src="http://uupaa-js.googlecode.com/svn/trunk/img/o32.png" alt="" /><br />9.5+</th>
  <th><img src="http://uupaa-js.googlecode.com/svn/trunk/img/f32.png" alt="" /><br />3.0</th>
  <th><img src="http://uupaa-js.googlecode.com/svn/trunk/img/f32.png" alt="" /><br />3.5</th></tr>
</thead>
<tbody>
<tr>
  <th>canvas</th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/4_3_canvas_globalalpha.html">globalAlpha</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/6_1_canvas_composite.html">globalCompositeOperation</a></th><td>---</td>
  <td><span class="star4"></span></td>
  <td><span class="star4"></span></td>
  <td><a href="#compo" class="star2"></a></td>
  <td><a href="#compo" class="star2"></a></td>
  <td><span class="star5"></span></td>
  <td><span class="star4"></span></td>
  <td><span class="star4"></span></td></tr>
<tr>
  <th><a href="demo/4_2_canvas_strokestyle.html">strokeStyle</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/4_1_canvas_fillstyle.html">fillStyle</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/4_5_canvas_linewidth.html">lineWidth</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/4_6_canvas_linecap.html">lineCap</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/4_7_canvas_linejoin.html">lineJoin</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/4_8_canvas_miterlimit.html">miterLimit</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star4"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/9_1_canvas_shadow_text_direction.html">shadowOffsetX</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><a href="#TextAPI_only" class="star1"></a></td>
  <td><a href="#setShadow" class="star4"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/9_1_canvas_shadow_text_direction.html">shadowOffsetY</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><a href="#TextAPI_only" class="star1"></a></td>
  <td><a href="#setShadow" class="star4"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/9_1_canvas_shadow_text_direction.html">shadowBlur</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td>SL3: <span class="star4"></span><br />SL2: <a href="#shadowBlur" class="star2"></a></td>
  <td><a href="shadowBlur" class="star2"></a></td>
  <td><a href="#TextAPI_only" class="star1"></a></td>
  <td><a href="#setShadow" class="star4"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/9_1_canvas_shadow_text.html">shadowColor</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><a href="#TextAPI_only" class="star1"></a></td>
  <td><a href="#setShadow" class="star4"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/8_8_canvas_fonts.html">font</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star2"></span></td>
  <td><span class="star4"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/8_3_canvas_textAlign.html">textAlign</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star4"></span></td>
  <td><span class="star4"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/8_4_canvas_textBaseline.html">textBaseline</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><a href="#textBaseline" class="star2"></a></td>
  <td><a href="#textBaseline" class="star2"></a></td>
  <td><a href="#textBaseline" class="star2"></a></td>
  <td><a href="#textBaseline" class="star2"></a></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/5_1_canvas_savestate.html">save()</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/5_1_canvas_savestate.html">restore()</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/5_4_canvas_scale.html">scale()</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/5_3_canvas_rotate.html">rotate()</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/5_2_canvas_translate.html">translate()</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/5_5_canvas_transform.html">transform()</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/5_5_canvas_transform.html">setTransform()</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/2_8_canvas_clearRect.html">clearRect()</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star4"></span></td>
  <td><span class="star4"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/2_1_canvas_rect.html">fillRect()</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/2_1_canvas_rect.html">strokeRect()</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/2_2_canvas_moveto.html">beginPath()</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/2_3_canvas_lineto.html">closePath()</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/2_3_canvas_lineto.html">moveTo()</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/2_3_canvas_lineto.html">lineTo()</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/2_5_canvas_quadraticcurveto.html">quadraticCurveTo()</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/2_6_canvas_beziercurveto.html">bezierCurveTo()</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th>arcTo()</th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star0">-</span></td>
  <td><span class="star0">-</span></td>
  <td><span class="star1"></span></td>
  <td><span class="star1"></span></td>
  <td><span class="star1"></span></td></tr>
<tr>
  <th>rect()</th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/2_4_canvas_arc.html">arc()</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/2_3_canvas_lineto.html">fill()</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/4_9_canvas_lineargradient.html">fill()</a></th><td>+ linearGradient</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star4"></span></td>
  <td><span class="star4"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/4_10_canvas_radialgradient.html">fill()</a></th><td>+ radialGradient</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star4"></span></td>
  <td><span class="star4"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/4_11_canvas_createpattern.html">fill()</a></th><td>+ pattern</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star4"></span></td>
  <td><span class="star4"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/4_11_canvas_createpattern+matrix.html">fill()</a></th><td>+ pattern + <a href="demo/4_11_canvas_createpattern+matrix.html">matrix</a></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><a href="#fill_pattern_matrix" class="star2"></a></td>
  <td><a href="#fill_pattern_matrix" class="star2"></a></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/9_2_canvas_shadow_path.html">fill()</a></th><td>+ shadow</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star4"></span></td>
  <td><span class="star4"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/2_3_canvas_lineto.html">stroke()</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/9_3_canvas_shadow_stroke.html">stroke()</a></th><td>+ linearGradient</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><a href="#stroke_linearGradient" class="star2"></a></td>
  <td><span class="star4"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/9_3_canvas_shadow_stroke.html">stroke()</a></th><td>+ radialGradient</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star4"></span></td>
  <td><span class="star4"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/9_5_canvas_shadow_pattern.html">stroke()</a></th><td>+ pattern</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star4"></span></td>
  <td><span class="star4"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/9_5_canvas_shadow_pattern.html">stroke()</a></th><td>+ pattern + <a href="demo/4_11_canvas_createpattern+matrix.html">matrix</a></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><a href="#stroke_pattern_matrix" class="star2"></a></td>
  <td><a href="#stroke_pattern_matrix" class="star2"></a></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/9_5_canvas_shadow_pattern.html">stroke()</a></th><td>+ shadow</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star4"></span></td>
  <td><span class="star4"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/6_2_canvas_clipping.html">clip()</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star4"></span></td>
  <td><a href="#clip" class="star2"></a></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th>isPointInPath()</th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star0">-</span></td>
  <td><span class="star0">-</span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/8_1_canvas_fillText_strokeText.html">fillText()</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star4"></span></td>
  <td><span class="star4"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/9_1_canvas_shadow_text_linearGradient.html">fillText()</a></th><td>+ linearGradient</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star4"></span></td>
  <td><span class="star4"></span></td>
  <td><span class="star0">-</span></td>
  <td><span class="star2"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/9_1_canvas_shadow_text_radialGradient.html">fillText()</a></th><td>+ radialGradient</td>
  <td><span class="star1"></span></td>
  <td><span class="star1"></span></td>
  <td><span class="star1"></span></td>
  <td><span class="star1"></span></td>
  <td><span class="star0">-</span></td>
  <td><span class="star0">-</span></td>
  <td><span class="star1"></span></td></tr>
<tr>
  <th><a href="demo/9_1_canvas_shadow_text_pattern.html">fillText()</a></th><td>+ pattern</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star4"></span></td>
  <td><span class="star4"></span></td>
  <td><span class="star0">-</span></td>
  <td><span class="star0">-</span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/9_1_canvas_shadow_text.html">fillText()</a></th><td>+ shadow</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star4"></span></td>
  <td><span class="star4"></span></td>
  <td><span class="star2"></span></td>
  <td><span class="star4"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/9_1_canvas_shadow_text_alpha.html">fillText()</a></th><td>+ globalAlpha</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star4"></span></td>
  <td><span class="star4"></span></td>
  <td><span class="star4"></span></td>
  <td><span class="star4"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th>strokeText()</th><td>---</td>
  <td><a href="#strokeText" class="star2"></a></td>
  <td><span class="star5"></span></td>
  <td><a href="#strokeText" class="star2"></a></td>
  <td><a href="#strokeText" class="star2"></a></td>
  <td><a href="#strokeText" class="star2"></a></td>
  <td><a href="#strokeText" class="star2"></a></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th>strokeText()</th><td>+ linearGradient</td>
  <td><span class="star2"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star2"></span></td>
  <td><span class="star2"></span></td>
  <td><span class="star1"></span></td>
  <td><span class="star1"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th>strokeText()</th><td>+ radialGradient</td>
  <td><span class="star1"></span></td>
  <td><span class="star1"></span></td>
  <td><span class="star1"></span></td>
  <td><span class="star1"></span></td>
  <td><span class="star1"></span></td>
  <td><span class="star1"></span></td>
  <td><span class="star1"></span></td></tr>
<tr>
  <th>strokeText()</th><td>+ pattern</td>
  <td><span class="star1"></span></td>
  <td><span class="star1"></span></td>
  <td><span class="star1"></span></td>
  <td><span class="star1"></span></td>
  <td><span class="star1"></span></td>
  <td><span class="star1"></span></td>
  <td><span class="star1"></span></td></tr>
<tr>
  <th>strokeText()</th><td>+ shadow</td>
  <td><span class="star1"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star1"></span></td>
  <td><span class="star1"></span></td>
  <td><span class="star1"></span></td>
  <td><span class="star1"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th>strokeText()</th><td>+ globalAlpha</td>
  <td><span class="star2"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star2"></span></td>
  <td><span class="star2"></span></td>
  <td><span class="star1"></span></td>
  <td><span class="star1"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/8_2_canvas_measureText.html">measureText()</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/3_1_canvas_drawimage.html">drawImage(image)</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/3_1_canvas_drawimage+matrix.html">drawImage(image)</a></th><td>+ matrix</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/3_2_canvas_drawimage+alpha.html">drawImage(image)</a></th><td>+ alpha</td>
  <td><span class="star0">-</span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><a href="#drawImage_alpha" class="star0">-</a></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/3_5_canvas_drawimage_canvas.html">drawImage(canvas)</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star4"></span></td>
  <td><span class="star4"></span><br />arg9: <a href="#drawImage_canvas_matrix" class="star1"></a></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/3_5_canvas_drawimage_canvas+matrix.html">drawImage(canvas)</a></th><td>+ matrix</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star4"></span></td>
  <td><span class="star4"></span><br />arg9: <a href="#drawImage_canvas_matrix" class="star1"></a></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/3_5_canvas_drawimage_canvas.html">drawImage(canvas)</a></th><td>+ alpha</td>
  <td><span class="star0">-</span></td>
  <td><span class="star5"></span></td>
  <td><span class="star4"></span></td>
  <td><a href="#drawImage_alpha" class="star0">-</a></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>

<tr>
  <th>createImageData()</th><td>---</td>
  <td><span class="star1"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star0">-</span></td>
  <td><span class="star0">-</span></td>
  <td><span class="star0">-</span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th>getImageData()</th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star0">-</span></td>
  <td><span class="star0">-</span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th>putImageData()</th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star0">-</span></td>
  <td><span class="star0">-</span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/4_9_canvas_lineargradient.html">createLinearGradient()</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><a href="#createLinearGradient" class="star4"></a></td>
  <td><a href="#createLinearGradient" class="star4"></a></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/4_10_canvas_radialgradient.html">createRadialGradient()</a></th><td>---</td>
  <td><span class="star4"></span></td>
  <td><span class="star5"></span></td>
  <td><a href="#createRadialGradient" class="star4"></a></td>
  <td><a href="#createRadialGradient" class="star4"></a></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
<tr>
  <th><a href="demo/4_11_canvas_createpattern.html">createPattern()</a></th><td>---</td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><a href="#createPattern" class="star2"></a></td>
  <td><a href="#createPattern" class="star2"></a></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td>
  <td><span class="star5"></span></td></tr>
</tbody>
</table>
<ul>
<li><a name="compo">globalCompositeOperation</a>: only "source-over", "destination-over" and "copy" are supported.</li>
<li><a name="shadowBlur">shadowBlur</a>: <span lang="ja">VML や Silverlight2以下なら影のレンダリングをエミュレーションする</span></li>
<li><a name="setShadow">setShadow</a>: <span lang="ja"><a href="CLASS.htm#firefox3_shadow_bug">Firefox3.0 のバグ</a>を回避するために追加された setShadow() を利用することで影の色,位置,拡散が設定可能</span></li>
<li><a name="textBaseline">textBaseline</a>: only "top" is supported.</li>
<li><a name="fill_pattern_matrix">fill pattern matrix</a>: <span lang="ja">パターン画像が傾斜しない</span></li>
<li><a name="stroke_linearGradient">stroke + linearGradient</a>: <span lang="ja">VML は stroke + linearGradient で不透明度やグラデーションが使えない(単色のみ)</span></li>
<li><a name="stroke_pattern_matrix">stroke pattern matrix</a>: <span lang="ja">パターン画像が傾斜しない</span></li>
<li><a name="clip">clip</a>: <span lang="ja">複雑なパスやネストしたパスはサポートしない</span></li>
<li><a name="strokeText">strokeText</a>: <span lang="ja">fillText() と同じ結果になる</span></li>
<li><a name="drawImage_alpha">drawImage(image) + alpha</a>: <span lang="ja">VMLは画像の不透明度だけを設定する汎用的な方法が存在しない(fill か stroke の色が混じってしまう)</span></li>
<li><a name="drawImage_canvas_matrix">drawImage(canvas) + matrix</a>: <span lang="ja">引数9個版は sx, sy が無視される</span></li>
<li><a name="createLinearGradient">createLinearGradient</a>: <span lang="ja">描画範囲と中心座標の指定方法に制限あり</span></li>
<li><a name="createRadialGradient">createRadialGradient</a>: <span lang="ja">描画範囲と中心座標の指定方法に制限あり</span></li>
<li><a name="fillText">fillText</a>: arg:maxWidth unsupported. <span lang="ja">引数 maxWidth は未サポート</span></li>
<li><a name="strokeText">strokeText</a>: arg:maxWidth unsupported. <span lang="ja">引数 maxWidth は未サポート</span></li>
<li><a name="TextAPI_only">TextAPI only</a>: <span lang="ja">Opera9.5+ の Shadow は Text API 限定</span></li>
<li><a name="createPattern">createPattern</a>: <span lang="ja">Silverlight または VML では canvas を指定できない</span></li>
</ul>

<hr />
<h2>Installation - 導入方法</h2>
<p>uupaa-excanvas.js is a package of a part of the function of uupaa.js. 
  <br /><span lang="ja">uupaa-excanvas.js は uupaa.js の機能の一部をパッケージしたものです。</span>
</p>

<a href="demo/helloworld.html">Hello World</a>
<pre class="eg">
&lt;html&gt;
&lt;head&gt;
  &lt;title&gt;Hello HTML5::Canvas world&lt;/title&gt;
  <b>&lt;script type="text/xaml" id="xaml"&gt;&lt;?xml version="1.0"?&gt;
        &lt;Canvas xmlns="http://schemas.microsoft.com/client/2007"&gt;&lt;/Canvas&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="../uupaa-excanvas.js"&gt;&lt;/script&gt;</b>
  &lt;script type="text/javascript"&gt;
  window.onload = function() {
    <b>uuCanvas.ready</b>(function() {
      var ctx = document.getElementById("canvas").getContext("2d");
      ctx.textBaseline = "top";
      ctx.font = "32pt Arial";
      ctx.fillStyle = "black";
      ctx.shadowOffsetX = 10;
      ctx.shadowOffsetY = 10;
      ctx.shadowColor = "gray";
      ctx.shadowBlur = 5;
      ctx.fillText("YES", 0, 0);
      ctx.fillText("WE", 0, 40);
      ctx.fillText("CANVAS!", 0, 80);
    });
  }
  &lt;/script&gt;
&lt;/head&gt;
&lt;body&gt;
  &lt;div&gt;
    <b>&lt;canvas id="canvas" width="500" height="200"&gt;&lt;/canvas&gt;</b>
  &lt;/div&gt;
&lt;/body&gt;
&lt;/html&gt;
</pre>

<hr />
<h2><a name="fonts">Fonts - フォント</a></h2>
<h4>High compatibility fonts - 互換性の高いフォント</h4>
<p><span lang="ja">Silverlight は以下のフォントを内蔵しています。
    これらのフォントは Silverlight と VML でほぼ同じレンダリング結果になるように調整が行われます。</span></p>
<ul>
  <li>Arial                            </li>
  <li>Arial Black                      </li>
  <li>Comic Sans MS                    </li>
  <li>Courier New                      </li>
  <li>Georgia                          </li>
  <li>Lucida Grande/Lucida Sans Unicode</li>
  <li>Times New Roman                  </li>
  <li>Trebuchet MS                     </li>
  <li>Verdana                          </li>
</ul>
<pre>
ctx.font ="32pt 'Times New Roman','Arial Black'";
ctx.fillText("Good support");
</pre>
<span lang="ja">
これ以外のフォントを指定すると、Silverlight と VML で<a href="demo/8_8_canvas_fonts.html">描画結果が異なる</a>場合があります。
<br />そのような場合は、xTextMarginTop を設定することで、調整が可能です。</span>

<h4>Japanese font - フォントの日本語名</h4>
<p><span lang="ja">Silverlight ではフォントの日本語名を指定できません、英語名で指定する必要があります。
    <br />ここに記載されていないフォントについても同様です。</span></p>
<table>
<tr><th>日本語名                      </th><th>英語名             </th></tr>
<tr><td>"ＭＳ 明朝"                   </td><td>"MS Mincho"        </td></tr>
<tr><td>"ＭＳ Ｐ明朝"                 </td><td>"MS PMincho"       </td></tr>
<tr><td>"ＭＳ ゴシック"               </td><td>"MS Gothic"        </td></tr>
<tr><td>"ＭＳ Ｐゴシック"             </td><td>"MS PGothic"       </td></tr>
<tr><td>"メイリオ"                    </td><td>"Meiryo"           </td></tr>
<tr><td>"IPAゴシック"                 </td><td>"IPAGothic"        </td></tr>
</table>
<pre>
ctx.font ="32pt 'MS Mincho'";
ctx.fillText("フォントの日本語名は指定できません");
</pre>

<hr />
<h2>Links</h2>
<ul>
  <li><a href="http://www.whatwg.org/specs/web-apps/current-work/">HTML5 spec</a></li>
  <li><a href="http://code.google.com/p/explorercanvas/">ExplorerCanvas</a></li>
  <li><a href="http://msdn.microsoft.com/en-us/library/bb979679(VS.95).aspx">Silverlight reference</a></li>
  <li><a href="http://msdn.microsoft.com/en-us/library/bb263898(VS.85).aspx">VML reference</a></li>
</ul>

<hr />
<h2>Address of thanks - 謝辞</h2>
<p>uuCanvas (VML2D part) got a hint from a wonderful conception of ExplorerCanvas.</p>

</body>
</html>
